<template>
  <el-main>
    <!-- <div class="so_middle"> -->
    <!-- <img alt="Vue logo" src="../assets/logo.png" /> -->
    <PlayerWindow msg="PlayerWindow" />
    <Introduce msg="Introduce" />
    <ClassBrowse :chapterlist="videChapter" />
    <!-- </div> -->
  </el-main>
</template>

<script>
// @ is an alias to /src
import PlayerWindow from "./PlayerWindow.vue";
import Introduce from "./Introduce.vue";
import ClassBrowse from "./ClassBrowse.vue";

export default {
  name: "Player",
  components: {
    PlayerWindow,
    Introduce,
    ClassBrowse
  },
  data() {
    return {
      videChapter: []
    };
  },
  created() {
    this.getVideoChapter();
  },
  methods: {
    getVideoChapter() {
      this.axios
        .get(`nc_search/videoChapter`)
        .then(res => {
          console.log(res.data.data);
          if (res.data.errCode && res.data.errCode == "success") {
            this.videChapter = res.data.data;
          }
        })
        .catch(err => {
          console.log(err);
          this.$message.error("视频章节查询失败！");
        });
    }
  }
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="scss">
.el-main {
  padding: 0;
}
</style>
